✅ Deploy Preview for craftjs ready!

Name	Link
🔨 Latest commit	3dd2607
🔍 Latest deploy log	https://app.netlify.com/sites/craftjs/deploys/644af7cdf0e69300082e9aed
😎 Deploy Preview	https://deploy-preview-521--craftjs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

Question: @prevwong do you have any suggestions on how I can make my pull request better?

Thank you very much for your time!

i have tried different ways to add duplicate functionality works for any section except ROOT, but couldn't make it work.

const duplicate = () => {
    const {
      data: { type, props },
    } = query.node(id).get();
    actions.add(query.createNode(React.createElement(type, props)), parent);
  };

this one can duplicate the selected element but not the child ones. Any idea how to achieve that?

the closest i got duplicating the entire node with children is

  const duplicate = () => {
    const originalNodeTree = query.node(id).toNodeTree();

    const {
      data: { parent },
    } = query.node(id).get();

    console.log({ originalNodeTree });

    actions.addNodeTree(originalNodeTree, parent, 1);
  };

but the issue i can see the the old ids remains which causes bunch of issues,

Hey @JohnFromme, there are some cases that need to be handled when cloning elements. You can't do it just by creating a new element with React and adding it to the editor. Check out this comment and also other discussions on the thread. #209 (comment)

Hey @JohnFromme, there are some cases that need to be handled when cloning elements. You can't do it just by creating a new element with React and adding it to the editor. Check out this comment and also other discussions on the thread. #209 (comment)

Thanks, the code from your reference issues, works fantastically.

Hey @JohnFromme, there are some cases that need to be handled when cloning elements. You can't do it just by creating a new element with React and adding it to the editor. Check out this comment and also other discussions on the thread. #209 (comment)

Thank you very much! I will take a look & make improvements.

Any updates on this? This would be a great feature to have in the core library @prevwong

⚠️ No Changeset found

Latest commit: 00350fd

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

The latest updates on your projects. Learn more about Vercel for Git ↗︎

The clone appears at the end of the Editor. How do I duplicate it right after the node itself?

The clone appears at the end of the Editor. How do I duplicate it right after the node itself?

You can get the current node's index in the parent node's children and add the duplicate in the next index.

const { actions, query } = useEditor()
const { parentNodeId, id } = useNode(node => ({
parentNodeId: node.data.parent
}))

const childNodes = query.node(parentNodeId).get().data.nodes;
currentNodeIndex = childNodes.indexOf(id);
actions.addNodeTree(nodeTree, parent, currentNodeIndex + 1);